// 引入request
import request from '../../utils/request';
Page({

  /**
   * 页面的初始数据
   */
  data: {
    banners:[],
    personalizedList:[],
    ranks:[]
  },

  // 获取banner数据
 async getBanners(){
      // 调用自己封装的request方法来发送请求，这个方法的特点是支持promise
      try{
          wx.showToast({
              title:'请求中...',
              icon:'loading'
          })
          const res = await request({
            url: '/banner',
            data: {
                type: 1
            }
        });
        // console.log(res);
        this.setData({
            banners: res.data.banners
        });
      } catch(e){
          wx.showToast({
            title: '请求失败!',
            icon:'error'
          })
      }
  },

  // 获取推荐歌单的数据
  async getPersonalized(){
     try{
         // 发送数据请求
        const res = await request({
            url:'/personalized'
        })
        console.log(res);

        // 更新data中的数据
        this.setData({
            personalizedList:res.data.result
        })
     }catch(e){
         wx.showToast({
           title: '请求失败!',
           icon:'error'
         })
     }
  },


  // 获取榜单数据
  async getRanks(){
      try{

        // 先创建一个空数组，用来临时存储请求回来的数据，以便后面对数据进行整理
        let ranks = [];
        // 需要进行四次请求，循环多次发请求
        for (let i = 0; i < 4; i++) {
           const res = await request({
               url:'/top/list',
               data:{
                   idx:i
               }
           })

           // 将请求回来的数据临时存储在ranks空数组中
           ranks.push(res.data.playlist);
           console.log(ranks)
        }

        // 因为只需要前五的数据，需要进行数据处理，使用forEach遍历进行处理
        ranks.forEach((item)=>{
            item.tracks = item.tracks.slice(0,5)
        })

        // 更新data中的数据
        this.setData({
            ranks:ranks
        })
        console.log(ranks)
      }catch(e){
          wx.showToast({
            title: '请求失败!',
            icon:'error'
          })
      }
  },


  moreHandler1(e) {
    console.log('推荐歌曲更多', e)
  },

  moreHandler2(e) {
    console.log('排行榜更多', e)
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
      this.getBanners();
      this.getPersonalized();
      this.getRanks();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})